import 'package:enterprise_v6_app/app/components/special_operation/custom_picker_photo.dart';
import 'package:enterprise_v6_app/app/core/core.dart';
import 'package:enterprise_v6_app/app/core/ext/list.dart';
import 'package:enterprise_v6_app/app/modules/application/education/personal_profile/face/face_controller.dart';
import 'package:enterprise_v6_app/router/app_pages.dart';

const _blue = Color(0xFF5C6DFF);

class EducationProfileFaceView extends StatelessWidget {
  EducationProfileFaceView({super.key});

  final controller = Get.put(EducationProfileFaceController());

  @override
  Widget build(BuildContext context) {
    return Obx(() => controller.isUpload.value ? _buildCollect() : _buildDisplay());
  }

  Widget _buildDisplay() {
    return ListView(
      children: [
        Container(
          height: 527.w,
          width: 287.w,
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(10.w),
          ),
          child: Column(
            children: [
              AppGaps.vGap20,
              Text(
                '照片',
                style: TextStyle(fontSize: 14.w),
              ),
              AppGaps.vGap20,
              Image.network(controller.url ?? 'https://picsum.photos/200/300'),
            ],
          ),
        ),
        AppGaps.vGap10,
        _buildChangeBtn(),
      ],
    );
  }

  /// 采集
  Widget _buildCollect() {
    return ListView(
      children: [
        Container(
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(10.w),
          ),
          child: Column(
            children: _buildCollectBody(),
          ),
        ),
        AppGaps.vGap10,
        _buildBottom(),
      ],
    );
  }

  List<Widget> _buildCollectBody() {
    return [
      _buildCollectPhoto(),
      _buildCollectTip(),
      _buildCollectAcknowledge(),
    ];
  }

  Widget _buildCollectPhoto() {
    return Container(
      margin: EdgeInsets.only(top: 10.w),
      alignment: Alignment.centerLeft,
      child: Column(
        children: [
          _buildCollectPhotoSelectType(),
          controller.useLocalUpload.value ? _buildCollectPhotoUpload() : _buildCollectPhotoCapture(),
        ],
      ),
    );
  }

  Widget _buildCollectPhotoSelectType() {
    return Container(
      margin: EdgeInsets.symmetric(horizontal: 13.w),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '人脸识别保存图片',
            style: TextStyle(fontSize: 14.w),
          ),
          Row(
            mainAxisSize: MainAxisSize.max,
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              _buildSelectBtn('人脸采集', 0),
              _buildSelectBtn('本地上传', 1),
            ],
          )
        ],
      ),
    );
  }

  Widget _buildSelectBtn(String val, int idx) {
    return Container(
      margin: EdgeInsets.only(right: 10.w),
      child: Row(
        children: [
          Radio(
            value: idx,
            groupValue: controller.useLocalUpload.value ? 1 : 0,
            onChanged: (val) {
              controller.useLocalUpload.value = val == 1;
            },
          ),
          Text(
            val,
            style: TextStyle(fontSize: 14.w, color: const Color(0xFFA0A7B5)),
          ),
        ],
      ),
    );
  }

  Widget _buildCollectPhotoCapture() {
    return InkWell(
      onTap: () {
        Get.toNamed(AppRoutes.faceAuth);
      },
      child: Container(
        margin: EdgeInsets.symmetric(horizontal: 13.w),
        padding: EdgeInsets.symmetric(vertical: 3.w),
        decoration: BoxDecoration(color: _blue, borderRadius: BorderRadius.circular(44.w), border: Border.all(color: const Color(0xFF5C6DFF))),
        alignment: Alignment.center,
        child: Text(
          '开始采集',
          style: TextStyle(
            fontSize: 12.w,
            color: Colors.white,
          ),
        ),
      ),
    );
  }

  Widget _buildCollectPhotoUpload() {
    return Container(
      margin: EdgeInsets.symmetric(horizontal: 13.w),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          CustomPickerPhoto(
            title: '人脸照片',
            imagesList: controller.urlList,
            maxCount: 1,
            isRequired: true,
            callback: (path) {
              controller.urlList = path;
              controller.onSaveChanges();
            },
          ),
          Text(
            '支持JPG、PNG最大上传5M',
            style: TextStyle(fontSize: 10.w, color: const Color(0xFFA0A7B5)),
          ),
        ],
      ),
    );
  }

  Widget _buildCollectTip() {
    return Container(
      decoration: BoxDecoration(
        color: const Color(0xFFF5F5F5),
        borderRadius: BorderRadius.circular(10.w),
      ),
      margin: EdgeInsets.all(13.w),
      padding: EdgeInsets.all(13.w),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            '人脸采集 (请允许摄像头权限，保持良好光线，对准人脸进行拍照) ，否则将会影响账号使用',
            style: TextStyle(fontSize: 12.w),
          ),
          Text(
            '实名通过后才能进行人脸认证',
            style: TextStyle(
              color: Colors.redAccent,
              fontSize: 12.w,
            ),
          )
        ],
      ),
    );
  }

  Widget _buildCollectAcknowledge() {
    return Container(
      decoration: BoxDecoration(
        color: const Color(0xFFF5F5F5),
        borderRadius: BorderRadius.circular(10.w),
      ),
      margin: EdgeInsets.all(13.w),
      padding: EdgeInsets.all(13.w),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text(
            '人脸认证须知',
            style: TextStyle(fontSize: 14.w),
          ),
          Text(
            '1、请确保拍照环境光线良好，镜头清晰。',
            style: TextStyle(fontSize: 12.w),
          ),
          Text(
            '2、不要在照片内出现多人或遮挡脸部等影响识别结果。',
            style: TextStyle(fontSize: 12.w),
          ),
          Text(
            '3、请确保照片是本人，否则将影响学员的档案记录和职业考核。',
            style: TextStyle(fontSize: 12.w),
          ),
        ].joinWith(AppGaps.vGap6),
      ),
    );
  }

  Widget _buildChangeBtn() {
    return InkWell(
      onTap: () {
        controller.isUpload.value = true;
      },
      child: Container(
        padding: EdgeInsets.symmetric(vertical: 7.w),
        decoration: BoxDecoration(color: _blue, borderRadius: BorderRadius.circular(44.w), border: Border.all(color: const Color(0xFF5C6DFF))),
        alignment: Alignment.center,
        child: Text(
          '修改',
          style: TextStyle(
            fontSize: 16.w,
            color: Colors.white,
          ),
        ),
      ),
    );
  }

  Widget _buildBottom() {
    return Padding(
      padding: EdgeInsets.symmetric(vertical: 5.w),
      child: Row(
        children: [
          Expanded(
            child: InkWell(
              onTap: () {},
              child: Container(
                padding: EdgeInsets.symmetric(vertical: 9.w),
                decoration: BoxDecoration(
                    color: const Color(0x1A5C6DFF), borderRadius: BorderRadius.circular(44.w), border: Border.all(color: const Color(0xFF5C6DFF))),
                alignment: Alignment.center,
                child: Text(
                  '取消',
                  style: TextStyle(
                    fontSize: 16.w,
                    color: _blue,
                  ),
                ),
              ),
            ),
          ),
          AppGaps.hGap10,
          Expanded(
            child: InkWell(
              onTap: () {},
              child: Container(
                padding: EdgeInsets.symmetric(vertical: 9.w),
                decoration: BoxDecoration(
                  color: _blue,
                  borderRadius: BorderRadius.circular(44.w),
                ),
                alignment: Alignment.center,
                child: Text(
                  '提交',
                  style: TextStyle(
                    fontSize: 16.w,
                    color: Colors.white,
                  ),
                ),
              ),
            ),
          )
        ],
      ),
    );
  }
}
